/*
 * @Author: 肖思汗 
 * @Date: 2025-08-17 19:13:53 
 * @Last Modified by: xiaosihan
 * @Last Modified time: 2025-11-22 13:17:02
 */
import { ArrowRight } from '@nutui/icons-react-taro';
import { Text, View } from '@tarojs/components';
import { toJS } from 'mobx';
import { observer } from "mobx-react-lite";
import PageLayer from '../../components/PageLayer/PageLayer';
import styles from './index.module.less';
import indexStore from './indexStore';

import utilsService from '@/srcService/services/utilsService';
utilsService.get_ping();

// 主页 也是 选款式式的页面
const Index = observer(() => {

    const silhouetteGroups = toJS(indexStore.silhouetteGroups);

    return (
        <PageLayer className={styles.goodsTemlate}>


            <View className={styles.goodsTemlate_template_categories_container}>
                {
                    silhouetteGroups.map((category) => (
                        <View key={category.silhouette_group_id} className={styles.goodsTemlate_template_category}>
                            <View className={styles.goodsTemlate_category_header}>
                                <Text className={styles.goodsTemlate_category_name}>{category.name || '未命名模板'}</Text>
                                <View
                                    className={styles.goodsTemlate_arrow_icon}
                                    onClick={() => { }}
                                >
                                    <ArrowRight />
                                </View>
                            </View>

                            <View className={styles.goodsTemlate_template_list}>
                                {category.silhouettes.map((silhouette) => (
                                    <View
                                        key={silhouette.silhouette_id || `silhouette-${Math.random()}`}
                                        className={styles.goodsTemlate_template_item}
                                        onClick={() => { }}
                                    >
                                        <Text className={styles.goodsTemlate_category_name}>{silhouette.name}</Text>
                                    </View>
                                ))}
                            </View>
                        </View>
                    ))
                }
            </View>

        </PageLayer>
    );
});

export default Index;



